{extend name="common/layout" /}

{block name="content"}
	
	<link href="__SHOP_DEFAULT__/css/index.css" rel="stylesheet" type="text/css">
	<script src="__SITE_RESOURCE__/js/waypoints.js"></script>
	<script type="text/javascript" src="__SHOP_RESOURCE__/js/home_index.js" charset="utf-8"></script>
	<style type="text/css">
	    .category { display:block !important; }
	</style>
	
	<!--[if IE 6]>
	<script type="text/javascript" src="__SITE_RESOURCE__/js/ie6.js" charset="utf-8"></script>
	<![endif]-->
	
	<link rel="stylesheet" href="__SHOP_DEFAULT__/custom/css/layui.css">
	<link rel="stylesheet" type="text/css" href="__SHOP_DEFAULT__/custom/css/index.css">
	
	<!--茶叶分类轮播-->
	<link rel="stylesheet" href="__SHOP_DEFAULT__/custom/css/jPicture.min.css">
	
	<script src="__SHOP_DEFAULT__/custom/js/layer/layer.js"></script>
	<!--茶叶分类轮播-->
	<script src="__SHOP_DEFAULT__/custom/js/jPicture.min.js"></script>
	<!--页面定位JS-->
	<script src="__SHOP_DEFAULT__/custom/js/tab.lib.js"></script>

	
	<!--轮播-->
	<script>
	    // Javascript 代码
	    jPicture(".imgBox", {
	        type: "slide",
	        autoplay: 3000
	    });
	    
	
	</script>
	
	
	
	
	<!--轮播图片-->
	<div class="home-focus-layout">
	    {$web_html['index_pic']}
		
	</div>
	
	
	<div class="container">
	    <!--品牌推荐-->
	    {$web_html['index_bran']}
	    <div class="clearfix" style="display: block;"></div>
	
	    <!--tab推荐-->
	    {$web_html['index_sale']}
	</div>
	<div class="clearfix" style="display: block;"></div>
	
	
	
	<!--广告视频-->
	<div class="video-images" id="video-play" data-method="offset" data-type="auto">
	    <div class="video-images-block">
	        <img src="__UPLOAD_PATH__/shop/adv/{$index_video_img}" alt="">
	    </div>
	    <div class="video-blk"></div>
	    <div class="video-title">
	        <h3>极致珍贵的沉淀</h3>
	        <h4><i class="layui-icon">&#xe652;</i></h4>
	    </div>
	</div>
	<div class="clearfix" style="display: block;"></div>
	
	<!--楼层-->
	{$web_html['index']}
	
	
	
	<!--8f文章列表-->
	<div class="index-bg bg-8f">
	    <div class="container">
	        <div class="tea-class">
	            <div class="row">
	                <div class="tea-info-img">
	                	{volist name="cms_article_list" id="val" length="3"}
		                    <a href="{:url('cms/Cmsarticle/article_list',array('class_id'=> $val['class_id']))}">
		                        <img src="__SHOP_DEFAULT__/custom/images/guanGaoTu/tea-info-{$i}.jpg" alt="">
		                        <div class="tea-info-title">
		                            <h3>{$val['class_name']}</h3>
		                        </div>
		                    </a>
	                    {/volist}
	                </div>
	                <div class="clearfix" style="display: block;"></div>
	                <div class="tea-info-list">
						{volist name="cms_article_list" id="v" length="3"}
		                    <ul>
		                    	{volist name="v['class_id_sub']" id="val" length="8" key="j"}
			                        <li>
			                            <a href="{:url('cms/Cmsarticle/article_detail',array('article_id'=> $val['article_id']))}" title="{$val['article_title']}">
			                                {if($j == 1)}
												<img src="<?php echo getCMSArticleImageUrl($val['article_attachment_path'], $val['article_image'], 'list');?>" alt="<?php echo $val['article_title'];?>">
				                                <p>{$val['article_title']}</p>
				                                <span>{:date('Y-m-d',$val['article_publish_time'])}</span>
			                                {else /}
			                                	{$val['article_title']}
			                                {/if}
			                            </a>
			                        </li>
								{/volist}
		                    </ul>
	                    {/volist}
	
	                </div>
	            </div>
	        </div>
	        <div class="clearfix" style="display: block;"></div>
	    </div>
	</div>
	
	
	<div id="cti">
	    <div class="wrapper">
	        <div class="title">
	            <p class="p-1">一茶一坐，一偶清静，偷得浮生半日清闲</p>
	            <p class="p-2"><i>——</i> 喝好茶，享生活 <i>——</i></p>
	        </div>
	        <ul>
	        	<!-- {volist name="contract_list" id="val"}
	        			            {if $val['cti_descurl']}
	        				            <li>
	        				                <a href="{$val['cti_descurl']}" target="_blank">
	        					            		<span class="icon">
	        					            			<img src="{$val['cti_icon_url']}" />
	        					            		</span>
	        				                    <div class="hengXian"></div>
	        				                    <span class="name"> {$val['cti_name']} </span>
	        				                </a>
	        				            </li>
	        			            {else /} -->
			       <li>
				            	<span class="icon">
				            		<img src="__SHOP_DEFAULT__/images/server/1.png" />
				            	</span>
			                <div class="hengXian"></div>
			                <span class="name">品质承诺</span>
			            </li>    
			             <li>
				            	<span class="icon">
				            		<img src="__SHOP_DEFAULT__/images/server/2.png" />
				            	</span>
			                <div class="hengXian"></div>
			                <span class="name"> 闪电发货</span>
			            </li>     
			            <li>
				            	<span class="icon">
				            		<img src="__SHOP_DEFAULT__/images/server/3.png" />
				            	</span>
			                <div class="hengXian"></div>
			                <span class="name"> 完美售后</span>
			            </li>     
			            <li>
				            	<span class="icon">
				            		<img src="__SHOP_DEFAULT__/images/server/4.png" />
				            	</span>
			                <div class="hengXian"></div>
			                <span class="name"> 线下体验</span>
			            </li>
		     <!--        {/if}
		     	            {/volist} -->
	        </ul>
	    </div>
	</div>
	
	
	
	<!-- 左侧 -->
	<div id="nav_box" class="left-bar">

  <ul>
    <li class="nav_h_1"><a href="javascript:;" class="word">1F 普洱茶</a></li>
    <li class="nav_h_2"><a href="javascript:;" class="word">2F   红    茶</a></li>
    <li class="nav_h_3"><a href="javascript:;" class="word">3F  绿      茶</a></li>
    <li class="nav_h_4"> <a href="javascript:;" class="word">4F 乌龙茶</a></li>
    <li class="nav_h_5"> <a href="javascript:;" class="word">5F 花草茶</a></li>
    <li class="nav_h_6"> <a href="javascript:;" class="word">6F白/黄茶</a></li>
    <li class="nav_h_7"> <a href="javascript:;" class="word">7F 茶      膏</a></li>
    <li class="nav_h_8"> <a href="javascript:;" class="word">8F 茶空间</a></li>
  </ul>
</div>
	<div id="index-video" style="display: none;"></div>


	<!--视频播放-->
	<script type="text/javascript" src="__SHOP_DEFAULT__/custom/js/ckplayer/ckplayer.js" charset="utf-8"></script>
	<script type="text/javascript">
	    var flashvars = {
	        f: "__UPLOAD_PATH__/video/video.mp4",
	        c: 0,
	        b: 1,
	        //i: 'http://www.ckplayer.com/static/images/cqdw.jpg'
	    };
	    var params = {bgcolor: '#FFF', allowFullScreen: true, allowScriptAccess: 'always', wmode: 'transparent'};
	    //CKobject.embedSWF("<?php echo UPLOAD_SITE_URL.'/video/video.mp4';?>", 'index-video', 'ckplayer_index-video', '100%', '100%', flashvars, params);
	    CKobject.embedSWF("__SHOP_DEFAULT__/custom/js/ckplayer/ckplayer.swf", 'index-video', 'ckplayer_index-video', '100%', '100%', flashvars, params);
	
	    function closelights() {
	        //关灯
	        alert(' 本演示不支持开关灯');
	    }
	    function openlights() {
	        //开灯
	        alert(' 本演示不支持开关灯');
	    }
	
	
	    //视频点击播放
	    $('#video-play').on('click', function () {
	        layer.open({
	            type: 1,
	            title: '茶叶广告宣传',
	            area: ['996px', '560px'],
	            shadeClose: true, //点击遮罩关闭
	            content: $('#index-video'),
	            success: function (layero) {
	                // hack处理layer层中video播放器全屏样式错乱问题
	                setTimeout(function () {
	                    $(layero).removeClass('layer-anim');
	                }, 0);
	            }
	        });
	    });
	
	
	    //  普洱茶
	    $('#teaClassTab-1f').hover(function () {
	        $('#teaClassTab-1f > .active').removeClass('active')
	    }, function () {
	        $('#teaClassTab-1f > li:first').addClass('active')
	    });
	    //  红茶
	    $('#teaClassTab-2f').hover(function () {
	        $('#teaClassTab-2f >.active').removeClass('active')
	    }, function () {
	        $('#teaClassTab-2f > li:first').addClass('active')
	    })
	    //  绿茶
	    $('#teaClassTab-3f').hover(function () {
	        $('#teaClassTab-3f >.active').removeClass('active')
	    }, function () {
	        $('#teaClassTab-3f > li:first').addClass('active')
	    })
	    //  白茶
	    $('#teaClassTab-4f').hover(function () {
	        $('#teaClassTab-4f >.active').removeClass('active')
	    }, function () {
	        $('#teaClassTab-4f > li:first').addClass('active')
	    })
	    //  乌龙茶
	    $('#teaClassTab-5f').hover(function () {
	        $('#teaClassTab-5f >.active').removeClass('active')
	    }, function () {
	        $('#teaClassTab-5f > li:first').addClass('active')
	    })
	    //  花茶
	    $('#teaClassTab-6f').hover(function () {
	        $('#teaClassTab-6f >.active').removeClass('active')
	    }, function () {
	        $('#teaClassTab-6f > li:first').addClass('active')
	    })
	    //  茶具
	    $('#teaClassTab-7f').hover(function () {
	        $('#teaClassTab-7f >.active').removeClass('active')
	    }, function () {
	        $('#teaClassTab-7f > li:first').addClass('active')
	    })
	    //  茶生活
	    $('#teaClassTab-8f').hover(function () {
	        $('#teaClassTab-8f >.active').removeClass('active')
	    }, function () {
	        $('#teaClassTab-8f > li:first').addClass('active')
	    })
	
	
	
	    $(document).ready(function () {
	        /* 选项卡切换 */
	        $("#panic-buy").tab({
	            tabId: "#panic-buy1", tabTag: "li", conId: "#panic-goods", conTag: "div", act: "mouseover"
	        });
	
	    });


        // 加入购物车
        $(window).resize(function() {
            $('.goods-box-buy').on('click','a[nctype="add_cart"]', function() {
                flyToCart($(this));
            });
        });
        $('.goods-box-buy').on('click','a[nctype="add_cart"]', function() {
            flyToCart($(this));
        });
        function flyToCart($this) {
            var rtoolbar_offset_left = $("#rtoolbar_cart").offset().left;
            var rtoolbar_offset_top = $("#rtoolbar_cart").offset().top-$(document).scrollTop();
            var img = $this.parents('li').find('img').attr('src');
            var data_gid = $this.attr('data-gid');
            var flyer = $('<img class="u-flyer" src="'+img+'" style="z-index:999">');
            flyer.fly({
                start: {
                    left: $this.offset().left,
                    top: $this.offset().top-$(document).scrollTop()
                },
                end: {
                    left: rtoolbar_offset_left,
                    top: rtoolbar_offset_top,
                    width: 0,
                    height: 0
                },
                onEnd: function(){
                    addcart(data_gid,1,'');
                    flyer.remove();
                }
            });
        }
	
	
	</script>

<script type="text/javascript" src="__SITE_RESOURCE__/js/fly/jquery.fly.min.js" charset="utf-8"></script>
<!--[if lt IE 10]>
<script type="text/javascript" src="__SITE_RESOURCE__/js/fly/requestAnimationFrame.js" charset="utf-8"></script>
<![endif]-->

{/block}

{block name="script"}{/block}